import { Platform } from 'react-native'
import { TabNavigator, StackNavigator } from 'react-navigation'
import ServerScreen from '../Containers/ServerScreen'
import OrderScreen from '../Containers/OrderScreen'
import HomeScreen from '../Containers/HomeScreen'
import UserScreen from '../Containers/UserScreen'
import CommodityScreen from '../Containers/CommodityScreen'

let labelStyle = {
  margin: 0,
}

if (Platform.OS === 'ios') {
  labelStyle = {
    marginTop: -5,
    marginBottom: 5,
  }
}

const FooterNavigation = TabNavigator({
  HomeScreen: { screen: HomeScreen },
  ServerScreen: { screen: ServerScreen },
  CommodityScreen: { screen: CommodityScreen },
  OrderScreen: { screen: OrderScreen },
  UserScreen: { screen: UserScreen },
}, {
  lazy: true,
  tabBarPosition: 'bottom',
  animationEnabled: true,
  swipeEnabled: false,
  tabBarOptions: {
    inactiveTintColor: '#636e72',
    activeTintColor: '#00b894',
    showIcon: 'true',
    showLabel: 'false',
    indicatorStyle: {
      backgroundColor: 'transparent',
    },
    labelStyle: labelStyle,
    style: {
      backgroundColor: 'white'
    }
  }
})

export default FooterNavigation
